import {createRouter, createWebHashHistory} from "vue-router";
import A from "@/路由/A.vue";
import B from "@/路由/B.vue";
import C from "@/路由/C.vue";
import C1 from "@/路由/C1.vue";
import C2 from "@/路由/C2.vue";
import C3 from "@/路由/C3.vue";
import C4 from "@/路由/C4.vue";

export const router = createRouter({
    history: createWebHashHistory(), // 路由器的工作模式
    routes: [
        {
            path:"/",
            // 将路径 / 重定向到/a
            redirect:"/a"
        },
        {
            name: 'homePage', path: "/a", component: A
        },
        {
            path: "/b", component: B
        },
        {
            name: "c", path: "/c", component: C,
            children: [
                {path: "c1", component: C1},
                {path: "c2", component: C2},
                {
                    name: "c3", path: "c3/:a/:b/:c?", // 加?表示可传可不传
                    component: C3
                },
                {
                    name: "c4", path: "c4/:a/:b/:c?", // 加?表示可传可不传
                    component: C4,
                    // 将路由收到的所有params参数作为props传给路由组件
                    props: true
                },
                {
                    name: "c5", path: "c4/:a/:b/:c?", // 加?表示可传可不传
                    component: C4,
                    // 将路由收到的所有params参数作为props传给路由组件
                    props(route) {
                        return route.params
                    }
                    // 这种写法很少见
                    // props: {
                    //     a: 10,
                    //     b: 20
                    // }
                }
            ]
        }
    ]
})
